function message_board() {
    if(!connect_success) {
        alert("服务器错误");
        return;
    }
    let secitem = document.querySelector(".pagination");
    if(secitem != null)
        secitem.remove();
    secitem = document.querySelector(".pagination-container");
    if(secitem != null)
        secitem.remove();
    secitem = document.querySelector(".sec_item");
    secitem.innerHTML = `<h1>简易留言板</h1>
                         <input id="edittext" type="text" size="40"> <input type="button" value="留言" onclick="btn_clicked()">
                         <div id="msg_c"></div>`;

    console.log("item json:" + board_item_json);
    let board_item = JSON.parse(board_item_json);
    if(board_item.length === 0 || board_item.length === undefined)
        return;
    
    board_item.forEach((item,index)=>{
        secitem = document.querySelector("#msg_c");
        secitem.innerHTML += `<div>
                                <img src=${item.img_src} alt="hpic" class="round_icon">
                                <div style="position: relative; top: -40px; left: 50px"><label>${item.id} 说:</label><br><label>${item.content}</label></div>
                                </div>`;
    });
}

function getFullTime() {
    let date = new Date(),//时间戳为10位需*1000，时间戳为13位的话不需乘1000
        Y = date.getFullYear() + '',
        M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1),
        D = (date.getDate() < 10 ? '0'+(date.getDate()) : date.getDate()),
        h = (date.getHours() < 10 ? '0'+(date.getHours()) : date.getHours()),
        m = (date.getMinutes() < 10 ? '0'+(date.getMinutes()) : date.getMinutes()),
        s = (date.getSeconds() < 10 ? '0'+(date.getSeconds()) : date.getSeconds());
    return Y + "年" + M + "月" + D + "日" + h + ":" + m + ":" + s;
}

function btn_clicked() {
    if(document.querySelector("#edittext").value === "") {
        alert("请输入留言");
        return;
    }
    let msg_item = {};
    msg_item["id"] = `${getFullTime()}  ${returnCitySN.cip}`;
    let msg_content = document.createElement("div");
    let img_src = "img/head_icon/pic" + Math.floor(Math.random()*10) + ".jpeg";
    msg_item["img_src"] = `${img_src}`;
    let secitem = document.querySelector("#edittext");
    msg_content.innerHTML = `<img src=${img_src} alt=${img_src} class="round_icon"> <div style="position: relative;top: -40px;left: 50px">
        <label>${getFullTime()}  ${returnCitySN.cip}  说:</label>
        <br>
        <label>${secitem.value}</label>
    </div>`;
    msg_item["content"] = `${secitem.value}`;
    secitem.value = '';
    secitem = document.querySelector("#msg_c");
    secitem.appendChild(msg_content);

    ws.send("MSGBOARD?SAVE?" + JSON.stringify(msg_item));
    /*
    let msg_header = document.createElement("div");
    msg_header.innerHTML = `<br>${getFullTime()}  ${returnCitySN.cip}  说:<br>`;
    let msg_item = {};
    msg_item["id"] = `${getFullTime()}  ${returnCitySN.cip}`;
    let secitem = document.querySelector("#msg_c");
    secitem.appendChild(msg_header);
    let msg_content = document.createElement("span");
    secitem = document.querySelector("#edittext");
    msg_content.innerHTML = `${secitem.value}<br>`;
    msg_item["content"] = `${secitem.value}`;
    secitem.value = '';
    secitem = document.querySelector("#msg_c");
    secitem.appendChild(msg_content);

    let board_item = JSON.parse(board_item_json);
    board_item.push(msg_item);
    board_item_json = JSON.stringify(board_item);
    ws.send("SAVE?" + JSON.stringify(msg_item));
     */
}
